<template>
  <v-container>
    <v-toolbar flat color="white">
      <v-toolbar-title>摄像头状态</v-toolbar-title>
    </v-toolbar>
    <v-divider></v-divider>
    <v-data-table :headers="headers" :items="all" class="elevation-1" :rows-per-page-items="[6]">
      <template slot="items" slot-scope="props">
        <td>{{ props.item.no }}</td>
        <td class="text-xs-left">{{ props.item.cam }}</td>
        <td class="text-xs-left">{{ props.item.status == 0 ? '故障': '正常' }}</td>
      </template>
    </v-data-table>
  </v-container>
</template>

<script>
import { mapActions, mapGetters, mapState } from "vuex";
import { log } from "util";

export default {
  data() {
    return {
      headers: [
        {
          text: "序号",
          align: "left",
          sortable: true,
          value: "no"
        },
        { text: "摄像头编号", value: "cam" },
        { text: "状态", value: "status", sortable: false }
      ]
    };
  },

  computed: {
    ...mapGetters("camerastatus", ["all"])
  },

  methods: {
    ...mapActions("camerastatus", ["getCameraStatus"])
  },

  created() {
    // console.log(this.getCameraStatus);
    // this.$store.dispatch("CameraStatus/getCameraStatus");
    // console.log(this.all);
  }
};
</script>

